import React,{Component} from "react";
import './header.scss'
class Header extends Component {
  state = { 
    title:'',
    content:''
   }
  //评论人
   onChangeTitle=(e)=>{
    console.log(e.target.value);
      this.setState({
        title:e.target.value
      })
   }
   //评论内容
   onChangeContent=(e)=>{
    console.log(e.target.value);
      this.setState({
        content:e.target.value
      })
   }
   //提交
   onChangeBtn=()=>{
     const {title,content} = this.state
     this.props.update({title,content})
     this.setState({
      title:'',
      content:''
     })
   }

  render() { 
    return (
        <>
           <input type="text" placeholder="请输入评论人" className="comment" onChange={this.onChangeTitle} value={this.state.title}/>
            <textarea placeholder="请输入评论内容" className="textarea"  onChange={this.onChangeContent} value={this.state.content}></textarea>
            <button className="btn" onClick={this.onChangeBtn}>发表评论</button>
        </>
      );
  }
}
 
export default Header;